import { Progress } from 'antd';

export default function Circle(props: any) {
  const rate = props.rate;
  const title = props.title;

  return (
    <>
      <Progress
        size={120}
        type="circle"
        percent={rate}
        trailColor={'#E8F3FF'}
        strokeColor="#165DFF"
        format={() => (
          <div
            style={{
              color: '#000',
              fontWeight: '700',
              fontSize: '20px',
            }}
          >{`${rate}%`}</div>
        )}
      />
      <div
        style={{
          textAlign: 'center',
          color: '#5D6173',
          height: '30px',
          lineHeight: '30px',
          marginTop: '8px',
          fontSize: '15px',
        }}
      >{`${title}`}</div>
    </>
  );
}
